@charset "utf-8";
*{
	padding: 0;
	margin: 0;
	text-decoration: none;/* 下掉超链接的下划线 */
	list-style: none;/* 下掉无序列表前的点 */
	font-family: 微软雅黑,sans-serif;
	color: #9a9898;
	font-size: 14px;
}
/* 1.网页头部：设置宽 100% 高 47px  边框 */
header{
	width: 100%;
	height: 47px;
	bor der: 1px solid red; 
	background-color: #333;
}
/* 2.网页中控：显示主体内容，主体、页尾中控 */
div#wrapper{
	width: 1247px;
	height: 47px;/* 考虑：主体、页尾占宽度+高度 */
	back ground-color: #00ff00;
	margin: 0 auto;
}
/* 3.网页中控区：左侧部分 */
div#wrapper div.left{
	width: 640px;
	height: 47px;
	back ground-color: #ffff00;
	float: left;
}
/* 3.1左侧部分：li 导航数据：布局：浮动、设置高 */
div#wrapper div.left ul li{
	float: left;
	height: 47px;
}
/* 3.2左侧部分：li a 垂直居中 左右空间 */
div#wrapper div.left ul li a{
	border-right: 1px solid #424242;
	line-height: 47px;
	padding: 0 6px;
}
/* 3.3左侧部分：最后一个竖边拿下 */
div#wrapper div.left ul li a.fix{
	border: none;
}

/* 4.网页中控区：右侧部分 */
div#wrapper div.right{
	width: 214px;
	height: 47px;
	back ground-color: #ffaaff;
	float: right;
}
/* 4.1右侧部分：li 导航数据：布局：浮动、设置高 */
div#wrapper div.right ul li{
	float: right;
	height: 47px;
}
/* 4.2右侧部分：li a 垂直居中 左右空间 */
div#wrapper div.right ul li a{
	border-right: 1px solid #424242;
	line-height: 47px;
	padding: 0 8px;
}
/* 4.3右侧部分：最后两个竖边拿下 */
div#wrapper div.right ul li a.fix{
	border: none;
}
/* 4.4购物车精灵图 */
div#wrapper div.right ul li i.shop{
	bor der: 1px solid red;
	padding: 0 10px;
	background: url(../img/buy.png) no-repeat;
	position: relative;
	top: 2px;
}
/* 4.5购物车区域：背景颜色 */
div#wrapper div.right ul li.gou{
	background-color: #424242;
}
/* 4.6购物车悬停效果：三个地方改变：背景改
								背景改同时改超链接
								背景改同时改精灵图*/
/* 4.6.1改变整体背景颜色 */
div#wrapper div.right ul li.gou:hover{
	background-color: #fff;
}
/* 4.6.2右侧超链接改变 */
div#wrapper div.right ul li.gou:hover a{
	color: #ff6700;
}
/* 4.6.3精灵图改变 */
div#wrapper div.right ul li.gou:hover i.shop{
	bor der: 1px solid red;
	background: url(../img/buy01.png) no-repeat;
}
/* 4.7左侧字体hover【群组选择器】 */
div#wrapper div.left ul li a:hover,div#wrapper div.right ul li a:hover{
	color: #fff;
}